<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core"  prefix="c"%>
<!-- f标签 取得jsp一些函数工具 -->
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="f"%>
<!-- 格式化标签 -->
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<% String path = request.getContextPath();%>
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Insert title here</title>
</head>
<body>
<form id="addFrom">
    出版社:<input type="text" name="pubName"><br>

    国:<select id="sheng" name="country" onchange="getShi(this)">
    <option>--请选择--</option>
</select>
    省:<select id="shi" name="province" onchange="getXian(this)">
    <option>--请选择--</option>
</select><br>
    市(区):<select id="xian" name="city" >
    <option>--请选择--</option>
</select><br>

    </select>
</form>
</body>
<script>
    function getSheng(){
        $.ajax({
            url:"/publisherController/getCityByPid",
            data:{pid:0},
            dataType:"json",
            type:"post",
            async:false,
            success:function(result){

                var city = result;
                console.log(city);
                var html = "<option value='-1'>--请选择--</option>";
                $(city).each(function(i,e){
                    html += "<option value='"+e['cid']+"'>"+e['cname']+"</option>";
                })
                $("#sheng").html(html)
            },
            error:function(){
                toastr.error("系统异常,请联系管理员");
            }
        })
    }

    $(function(){
        getSheng();
    })

    function getShi(obj){
        var pid = $(obj).val();
        $.ajax({
            url:"<%=path%>/publisherController/getCityByPid",
            data:{pid:pid},
            dataType:"json",
            type:"post",
            async:false,
            success:function(result){
                var city = result;
                var html = "<option value='-1'>--请选择--</option>";
                $(city).each(function(i,e){
                    html += "<option value='"+e['cid']+"'>"+e['cname']+"</option>";
                })
                $("#shi").html(html)
                $("#xian").html("<option value='-1'>--请选择--</option>")
            },
            error:function(){
                toastr.error("系统异常,请联系管理员");
            }
        })
    }

    function getXian(obj){
        var pid = $(obj).val();
        $.ajax({
            url:"<%=path%>/publisherController/getCityByPid",
            data:{pid:pid},
            dataType:"json",
            type:"post",
            async:false,
            success:function(result){
                var city = result;
                var html = "<option value='-1'>--请选择--</option>";
                $(city).each(function(i,e){
                    html += "<option value='"+e['cid']+"'>"+e['cname']+"</option>";
                })
                $("#xian").html(html)
            },
            error:function(){
                toastr.error("系统异常,请联系管理员");
            }
        })
    }
</script>
</html>